<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>点评</title>
    <link rel="stylesheet" type="text/css" href="/static/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/api.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.css"/>
    <style>

        /* 头部样式 */
        #firstHeader {
            background-color: #FF8400;
        }

        .topbar { /*background: #FF8400;*/
            height: 50px;
            border-bottom: 1px solid #DDDFE3;
        }

        .topbar_title {
            display: inline-block;
            font-size: 20px;
            line-height: 50px;
            padding-left: 12px;
        }

        .hr01, .hr02 {
            height: 28px;
        }

        .headerico {
            padding: 11px 15px 11px 15px;
        }

        .headericohover {
            background: #DADDE0;
        }

        .fr {
            float: right;
        }

        .fl {
            float: left;
        }

        /*第一头部*/
        #logo {
            padding: 11px 0 0 10px;
            height: 28px;
        }

        #citylist {
            height: 50px;
            line-height: 50px;
            padding-left: 15px;
            font-size: 18px;
            color: #fff;
        }

        .citylistarrow {
            vertical-align: top;
            width: 20px;
            padding-top: 15px;
        }

        .search {
            height: 34px;
            line-height: 34px;
            padding-left: 10px;
            border-radius: 30px;
            margin-top: 8px;
            position: absolute;
            left: 20px;
            right: 60px;
            font-size: 14px;
        }

        .search img {
            vertical-align: top;
            width: 20px;
            padding-top: 7px;
            padding-right: 10px;
        }

        .firstSearch {
            left: 90px;
            right: 60px;
            background-color: #FA6604;
            color: #FDC29B;
        }

        /* 第二头部 */
        #topbar_refresh {
            width: 40px;
            padding: 5px 10px;
        }

        .whitebar {
            background-color: #fcfcfc;
        }

        #whitecity {
            height: 50px;
            line-height: 50px;
            padding-left: 15px;
            font-size: 18px;
            color: #FF8400;
        }

        .secCitylistarrow {
            vertical-align: top;
            width: 15px;
            padding-top: 18px;
            padding-left: 5px;
        }

        .secSearch {
            left: 90px;
            right: 15px;
            background-color: #E8E8E8;
            color: #999;
        }

        /* 第三头部 */
        .swipepic {
            padding: 5px 15px 2px 15px;
            height: 23px;
        }

        .swipe div {
            font-size: 12px;
            text-align: center;
            color: #999;
        }

        .thrSearch {
            left: 15px;
            right: 60px;
            background-color: #E8E8E8;
            color: #999;
        }

        .bubble {
            margin-right: 10px;
            margin-bottom: 5px;
            border: 2px solid orange;
            border-radius: 8px;
            padding: 4px 8px 4px 8px;
        }

        /* 头部切换样式 */
        .titlebar {
            display: none;
        }

        .activebar {
            display: block;
        }

        /* 底部切换按钮样式 */
        ul {
            display: -webkit-box;
            display: -webkit-flex;
            display: flex;
        }

        #footer {
            height: 61px;
            line-height: 60px;
            background-color: #FAFAFA;
            border-top: 1px solid #FAFAFA;
        }

        #footer li {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
            height: 60px;
        }

        /* 选项卡样式 */
        .scrollbar {
            display: -webkit-box;
            display: -webkit-flex;
            text-align: center;
            height: 40px;
            line-height: 40px;
            background: #EBECF0;
            font-size: 12px;
            position: relative;
        }

        .col1 {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
            color: #909090;
        }

        .indexbar {
            position: absolute; /*background: #0fc;*/
            width: 50%;
            height: 5px;
            left: 0px;
            bottom: 0px;
            -webkit-transition: 300ms;
        }

        .redbox {
            background: #DB4646;
            width: 40px;
            height: 5px;
            position: relative;
            left: auto;
            right: auto;
            margin-left: auto;
            margin-right: auto;
        }

        /********************/
        /* 底部按钮原始样式 */
        /********************/
        .bbtn01 {
            background: url(./image/main_index_home_normal.png) no-repeat center 4px;
        }

        .bbtn02 {
            background: url(./image/main_index_tuan_normal.png) no-repeat center 4px;
        }

        .bbtn03 {
            background: url(./image/main_index_search_normal.png) no-repeat center 4px;
        }

        .bbtn04 {
            background: url(./image/main_index_my_normal.png) no-repeat center 4px;
        }

        .bottom_btn {
            width: 99%;
            height: 43px;
            padding-top: 18px;
            background-position-y: 4px;
            background-size: 30px;
            font-size: 12px;
            color: #A5A5A5;
        }

        /* 底部按钮激活样式 */
        .activebtn0 {
            background: url(./image/main_index_home_pressed.png) no-repeat center 4px;
        }

        .activebtn1 {
            background: url(./image/main_index_tuan_pressed.png) no-repeat center 4px;
        }

        .activebtn2 {
            background: url(./image/main_index_search_pressed.png) no-repeat center 4px;
        }

        .activebtn3 {
            background: url(./image/main_index_my_pressed.png) no-repeat center 4px;
        }

        .activebtn {
            color: #FF7419;
            background-size: 30px;
        }

        .bottomhover {
            background-color: #46494B;
        }

        /* 本地刷新图标 */
        #localrefresh {
            display: none;
            float: right;
            width: 40px;
            padding: 5px 10px;
        }

        input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
            color: #E1E1E1;
        }

        input:-moz-placeholder, textarea:-moz-placeholder {
            color: #E1E1E1;
        }

        input::-moz-placeholder, textarea::-moz-placeholder {
            color: #E1E1E1;
        }

        input:-ms-input-placeholder, textarea:-ms-input-placeholder {
            color: #E1E1E1;
        }

        .h80 {
            height: 80px;
        }

        .h40 {
            height: 40px;
        }

        .h20 {
            height: 20px;
        }

        .h10 {
            height: 10px;
            background: #f0f0f0;
        }

        .h1 {
            height: 1px;
            margin-left: 15px;
            background: #f0f0f0;
        }

        .fr {
            float: right;
        }

        .fl {
            float: left;
        }

        .hightitem {
            background-color: #fff;
        }

        /* 抢购样式 */
        .snapup {
            height: 80px;
        }

        .snapup .infologo {
            height: 60px;
            margin: 10px;
        }

        .snapup .shelf2 {
            display: table;
            height: inherit;
            margin-left: 10px;
        }

        .snapup .shelfcell {
            display: table-cell;
            vertical-align: middle;
        }

        .snapup .shelfcell .title {
            margin-bottom: 10px;
        }

        .snapup .arrow {
            width: 20px;
            padding-top: 30px;
            padding-right: 10px;
        }

        /* 2X2样式 */
        .row {
            display: -webkit-box;
            display: -webkit-flex;
        }

        .col {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
            position: relative;
        }

        .col img {
            position: absolute;
            right: 0;
            width: 80px;
            top: 0;
        }

        .col .matrixcell {
            display: table-cell;
            vertical-align: middle;
            padding-left: 10px;
        }

        .col .matrixcell .title {
            margin-bottom: 10px;
        }

        .matrix {
            display: table;
            height: inherit;
        }

        /* 猜你喜欢 */
        .guesstitle {
            height: auto;
            line-height: 20px;
            padding-left: 10px;
            vertical-align: top;
            font-size: 12px;
            color: #999;
        }

        .guesstitle img {
            height: 15px;
            padding-top: 12px;
            padding-left: 10px;
        }

        .home-tuan-list .item {
            position: relative;
            display: block;
            padding-left: 10px;
            border-bottom: 1px solid #e0e0e0;
        }

        .home-tuan-list .cnt {
            padding: 7px 10px 10px 0;
            display: box;
            display: -webkit-box;
            min-height: 78px;
            background-size: auto 1px;
        }

        .home-tuan-list .pic {
            margin-right: 10px;
            background: center;
        }

        .home-tuan-list img {
            width: 90px;
            height: 66px;
            margin-top: 7px;
            margin-bottom: 5px;
            border-radius: 3px;
        }

        .home-tuan-list .wrap {
            -webkit-box-flex: 1;
        }

        .home-tuan-list .wrap2 {
            display: table;
            height: 88px;
            width: 100%;
        }

        .home-tuan-list .content {
            -webkit-box-flex: 1;
            box-flex: 1;
            display: table-cell;
            vertical-align: middle;
        }

        .home-tuan-list .shopname {
            color: #333; /*line-height: 16px;*/
            font-size: 17px;
            max-width: 15em;
            white-space: nowrap;
            word-wrap: normal;
            text-overflow: ellipsis;
            overflow: hidden;
            min-height: 10px;
            padding-bottom: 2px;
            padding-top: 3px;
            display: inline-block;
        }

        .home-tuan-list .title {
            color: #666;
            line-height: 16px;
            font-size: 13px;
            max-height: 30px;
            overflow: hidden;
            padding-top: 3px;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .home-tuan-list .hot-title {
            margin-bottom: 8px;
        }

        .home-tuan-list .hot-subtitle {
            margin-bottom: 9px;
        }

        .home-tuan-list .info {
            margin-top: 9px; /*margin-bottom: 11px;*/
            color: #666;
            font-size: 12px;
            position: relative;
            line-height: 15px;
            display: box;
            display: -webkit-box;
            height: 15px;
        }

        .home-tuan-list .symbol {
            font-size: 14px;
            color: #f60;
            display: block;
            margin-top: 1px;
        }

        .home-tuan-list .price {
            color: #f60;
            font-size: 20px;
            line-height: 15px;
            margin-right: 5px;
            margin-top: 1px;
        }

        .home-tuan-list .o-price {
            color: #999;
            margin-top: 5px;
            line-height: 10px;
        }

        .home-tuan-list .sale {
            color: #f63;
            border: solid 1px #ff916e;
            padding: 3px 2px 2px;
            font-size: 10px;
            border-radius: 2px;
            -webkit-border-radius: 2px;
            margin-left: 5px;
            line-height: 10px;
            height: 10px;
        }

        .home-tuan-list .distance {
            -webkit-box-flex: 1;
            box-flex: 1;
            -ms-box-flex: 1;
            -ms-flex: 1;
            text-align: right;
            line-height: 10px;
            margin-top: 5px;
            color: #999;
            float: right;
            font-size: 12px;
        }

        .home-tuan-list .price, .index-rec .home-tuan-list .o-price, .index-rec .home-tuan-list .distance, .index-rec .home-tuan-list .sale {
            display: block;
            line-height: 15px;
            font-size: 12px;
        }

        .Fix:after {
            display: block;
            content: '';
            height: 0;
            clear: both;
        }

        /* 3. */
        .section03 .col img {
            width: 60px;
            top: 10px;
        }

        .section03 .title01 .title {
            color: #965037;
        }

        .section03 .title02 .title {
            color: #ffa001;
        }

        .section03 .title03 .title {
            color: #ff558c;
        }

        .section03 .title04 .title {
            color: #19b4ff;
        }

        .section03 .matrixcell .info {
            color: #666;
        }

        /* 2. */
        .section02 .shelfcell .title span {
            color: #ff6633;
        }

        .section02 .shelfcell .subtitel {
            color: #666;
            font-size: 14px;
        }

        .swiper-container {
            background-color: #fff;
        }

        /* 1. */
        .section01 .row {
            margin-top: 10px;
        }

        .section01 .col {
            text-align: center;
        }

        .section01 .col img {
            position: relative;
            width: 60%;
        }

        .section01 .col div {
            font-size: 13px;
            margin-top: 5px;
        }

        .presshover {
            background-color: #FAFAFA;
        }

        .brb {
            border-bottom: 1px solid #e0e0e0;
            border-right: 1px solid #e0e0e0;
        }

        .bb {
            border-bottom: 1px solid #e0e0e0;
        }

        .br {
            border-right: 1px solid #e0e0e0;
        }


        .swipe {
            overflow: hidden;
            visibility: hidden;
            position: relative;
            background: #fff;
            padding-bottom: 10px;
        }

        .swipe-wrap {
            overflow: hidden;
            position: relative;
        }

        .swipe-wrap .swipe-box {
            float: left;
            width: 100%;
            position: relative;
        }

        .sliderow {
            text-align: center;
            width: 100%;
            display: block;
        }

        /*.slidepanel .sliderow {margin-top: 10px;}*/
        .sliderow .slidecol {
            float: left;
            width: 25%;
        }

        .sliderow .slidecol img {
            width: 60%;
            margin-top: 10px;
        }

        .sliderow .slidecol div {
            font-size: 13px;
            margin-top: 5px;
        }


    </style>
</head>
<body>
<div id="wrap">

    <div id="firstHeader" class="titlebar activebar">
        <div class="topbar">
            <div class="citylist fl" id="citylist" tapmode="">上海<img src="./image/title_home_arrow_down_normal.png"
                                                                     alt="" class="citylistarrow"></div>
            <input class="search firstSearch" type="text" placeHolder="输入门店名搜索" name="keyword" id="keyword"
                   style="width:250px;outline-width:0px;"/>
            <input type="hidden" id="longitude" value="" name="longitude"/>
            <input type="hidden" id="latitude" value="" name="latitude"/>
            <span id="rightTitle" style="font-size:16px;color:white;float:right;padding-top:12px;">登录</span>
        </div>
    </div>


    <div id="main" style="padding:0px;width:100%;height:100%;border:0px;">
        <!-- 1. 头部swipe -->
        <div id='slider' class='swipe'>
            <div class='swipe-wrap'>
                <div class="swipe-box">
                    <div class="sliderow" id="slideRow1">
                    </div>
                    <div class="sliderow" id="slideRow2">
                    </div>
                </div>
            </div>
        </div>

        <div class="guesstitle" id="guess">猜你喜欢<img src="/static/image/home_competitive_icon.png" alt=""></div>
        <div class="home-tuan-list" id="tuanList">

        </div>
        <div class="guesstitle" id="searchTitle" style="font-size:14px;">
            <p id="resTitle">搜索结果</p>
            <div id="extraPadding" style="display:none;">
                <p>分类过滤</p>
                <div id="categoryFilter" style="margin-bottom:10px;"></div>
                <p>排序规则</p>
                <div id="priceFilter" style="margin-bottom:10px;"></div>
                <p>标签筛选</p>
                <div id="tagsFilter" style="margin-bottom:10px;"></div>
            </div>
        </div>
        <div class="home-tuan-list" id="searchList">

        </div>
    </div>

    <div id="footer">
        <ul>
            <li tapmode="activebtn0 activebtn">
                <a class="bottom_btn bbtn01 weixin activebtn activebtn0" href="/static/index.html">首页</a>
            </li>

            <li tapmode="activebtn1 activebtn">
                <a class="bottom_btn bbtn02 communicate">团购</a>
            </li>

            <li tapmode="activebtn2 activebtn">
                <a class="bottom_btn bbtn03 discover">发现</a>
            </li>

            <li tapmode="activebtn3 activebtn">
                <a class="bottom_btn bbtn04 home">我的</a>
            </li>
        </ul>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/script/api.js"></script>
<script type="text/javascript" src="/static/script/swipe.js"></script>
<script type="text/javascript" src="/static/script/jquery.min.js"></script>
<script type="text/javascript" src="/static/script/bootstrap.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=FqB15cbgf1pzWzum5ajGpTrcfr7b3b90"></script>

<script type="text/javascript">

    var g_orderby = null;
    var g_categoryFilter = null;
    var g_tagFilter = null;

    window.onload = function () {

        var slider =
            Swipe(document.getElementById('slider'), {
                auto: 1000000,
                continuous: true,
                callback: function (pos) {
                }
            });
    }

    getFloat = function (number, n) {
        n = n ? parseInt(n) : 0;
        if (n <= 0) return Math.round(number);
        number = Math.round(number * Math.pow(10, n)) / Math.pow(10, n);
        return number;
    };

    jQuery(document).ready(function () {
        var g_currentUser = null;

        $("#searchTitle").hide();

        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function (r) {
            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                var longitude = r.point.lng;
                var latitude = r.point.lat;
                $("#longitude").val(longitude);
                $("#latitude").val(latitude);

                $.ajax({
                    type: "GET",
                    url: "/shop/recommend?longitude=" + longitude + "&latitude=" + latitude,
                    success: function (data) {
                        if (data.status == 'success') {
                            var dataList = data.data;
                            for (var i = 0; i < dataList.length; i++) {
                                var distance = dataList[i].distance;
                                var distanceStr = "0m";
                                if (distance >= 1000) {
                                    distanceStr = getFloat(distance / 1000, 1) + " km";
                                } else {
                                    distanceStr = distance + " m";
                                }
                                var content = $('<a href="" class="item Fix hightitem">' +
                                    '<div class="cnt">' +
                                    '<img class="pic" src="' + dataList[i].iconUrl + '"/>' +
                                    '<div class="wrap">' +
                                    '<div class="wrap2">' +
                                    '<div class="content">' +
                                    '<div class="shopname">' + dataList[i].name + '</div><span class="distance">' + distanceStr + '</span>' +
                                    '<div class="title">' + dataList[i].tags + '</div>' +
                                    '<div class="info">' +
                                    '<span class="symbol">¥</span>' +
                                    '<span class="price">' + dataList[i].pricePerMan + '</span></div> </div> </div> </div> </div></a>');
                                $("#tuanList").append(content);
                            }
                        } else {
                            alert("获取门店信息失败，原因为" + data.data.errMsg);
                        }
                    },
                    error: function (data) {
                        alert("获取门店信息失败，原因为" + data.responseText);
                    }
                });
            } else {
                alert('failed' + this.getStatus());
            }
        }, {enableHighAccuracy: true});

        //获取当前用户的信息
        $.ajax({
            type: "POST",
            contentType: "application/json;charset=utf-8",
            url: "/user/getCurrentUser",
            success: function (data) {
                if (data.status == "success") {
                    if (data.data == null) {
                        g_currentUser = null;
                    } else {
                        g_currentUser = data.data;
                    }
                    if (g_currentUser == null) {
                        $("#rightTitle").text("登录");
                    } else {
                        $("#rightTitle").text("注销");
                    }
                } else {
                    alert("请求失败,原因为" + data.data.errMsg);
                }
            },
            error: function (data) {
                alert("网络请求失败，原因为" + data.responseText);
            }
        });

        //获取品类信息
        $.ajax({
            type: "GET",
            url: "/category/list",
            success: function (data) {
                if (data.status == 'success') {
                    var dataList = data.data;
                    for (var i = 0; i < dataList.length; i++) {
                        var content = $('<div class="slidecol"><img src="' + dataList[i].iconUrl + '" alt=""><div class="">' + dataList[i].name + '</div></div>');
                        if (i <= 3) {
                            $("#slideRow1").append(content);
                        } else {
                            $("#slideRow2").append(content);
                        }
                    }
                } else {
                    alert("获取品类信息失败，原因为" + data.data.errMsg);
                }
            },
            error: function (data) {
                alert("获取品类信息失败，原因为" + data.responseText);
            }
        });


        $("#rightTitle").on("click", function () {
            if (g_currentUser == null) {
                window.location.href = "/static/login.html";
            } else {
                $.ajax({
                    type: "POST",
                    contentType: "application/json;charset=utf-8",
                    url: "/user/logout",
                    success: function (data) {
                        if (data.status == "success") {
                            window.location.href = "/static/index.html";
                        } else {
                            alert("请求失败,原因为" + data.data.errMsg);
                        }
                    },
                    error: function (data) {
                        alert("网络请求失败，原因为" + data.responseText);
                    }
                });
            }
            return false;
        });

        function searchMethod() {

            var orderby = "";
            var categoryFilter = "";
            var tagFilter = "";

            var keyword = $("#keyword").val();
            var longitude = $("#longitude").val();
            var latitude = $("#latitude").val();
            if ($("#keyword").val() == "") {
                alert("关键字不能为空");
                return false;
            }
            if (longitude == "" || latitude == "") {
                alert("地址位置信息还未获取到，请等待");
                return false;
            }
            if (g_orderby == null) {
                orderby = "";
            } else {
                orderby = "&orderby=" + g_orderby;
            }

            if (g_categoryFilter == null) {
                categoryFilter = "";
            } else {
                categoryFilter = "&categoryId=" + g_categoryFilter;
            }
            if (g_tagFilter == null) {
                tagFilter = "";
            } else {
                tagFilter = "&tags=" + g_tagFilter;
            }
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "/shop/search?keyword=" + keyword + "&longitude=" + longitude + "&latitude=" + latitude + orderby + categoryFilter + tagFilter,
                success: function (data) {
                    if (data.status == 'success') {
                        $("#guess").hide();
                        $("#tuanList").hide();
                        $("#searchTitle").show();
                        $("#searchList").show();
                        $("#searchList").empty();
                        $("#slider").hide();
                        var dataList = data.data.shop;
                        var categoryList = data.data.category;
                        var tagsList = data.data.tags;
                        for (var i = 0; i < dataList.length; i++) {
                            var distance = dataList[i].distance;
                            var distanceStr = "";
                            if (distance >= 1000) {
                                distanceStr = getFloat(distance / 1000, 1) + " km";
                            } else {
                                distanceStr = distance + " m";
                            }
                            var content = $('<a href="" class="item Fix hightitem">' +
                                '<div class="cnt">' +
                                '<img class="pic" src="' + dataList[i].iconUrl + '"/>' +
                                '<div class="wrap">' +
                                '<div class="wrap2">' +
                                '<div class="content">' +
                                '<div class="shopname">' + dataList[i].name + '</div><span class="distance">' + distanceStr + '</span>' +
                                '<div class="title">' + dataList[i].tags + '</div>' +
                                '<div class="info">' +
                                '<span class="symbol">¥</span>' +
                                '<span class="price">' + dataList[i].pricePerMan + '</span></div> </div> </div> </div> </div></a>');
                            $("#searchList").append(content);
                        }
                        $("#categoryFilter").empty();
                        var categoryTag = $("<span class='bubble' data-id='" + 0 + "' id='category" + 0 + "'>全部</span>");
                        $("#categoryFilter").append(categoryTag);
                        for (var i = 0; i < categoryList.length; i++) {
                            var categoryTag = $("<span class='bubble' data-id='" + categoryList[i].id + "' id='category" + categoryList[i].id + "'>" + categoryList[i].name + "</span>");
                            $("#categoryFilter").append(categoryTag);
                        }


                        $("span[id^='category']").on('click', function () {
                            var id = $(this).data("id");
                            if (id == 0) {
                                g_categoryFilter = null;
                            } else {
                                g_categoryFilter = id;
                            }
                            searchMethod();
                        });

                        $("#priceFilter").empty();
                        $("#priceFilter").append($('<span class="bubble" id="defaultOrder">默认排序</span>'));
                        $("#priceFilter").append($('<span class="bubble" id="lowPriceOrder">低价排序</span>'));

                        $("#defaultOrder").on('click', function () {
                            g_orderby = null;
                            searchMethod();
                        });
                        $("#lowPriceOrder").on('click', function () {
                            g_orderby = 1;
                            searchMethod();
                        });

                        $("#tagsFilter").empty();
                        var tagTag = $("<span class='bubble' data-id='' id='tags'>全部</span>");
                        $("#tagsFilter").append(tagTag);
                        for (var i = 0; i < tagsList.length; i++) {
                            var tagTag = $("<span class='bubble' data-id='" + tagsList[i].tags + "' id='tags" + tagsList[i].tags + "'>" + tagsList[i].tags + "(" + tagsList[i].num + ")</span>");
                            $("#tagsFilter").append(tagTag);
                        }
                        $("span[id^='tags']").on('click', function () {
                            var id = $(this).data("id");
                            if (id == '') {
                                g_tagFilter = null;
                            } else {
                                g_tagFilter = id;
                            }
                            searchMethod();
                        });
                    } else {
                        alert("搜索失败，原因为" + data.data.errMsg);
                    }
                },
                error: function (data) {
                    alert("搜索失败，原因为" + data.responseText);
                }
            });
        }

        $('#keyword').on('keypress', function (event) {
            if (event.keyCode == 13) {
                searchMethod();
            }
        });

        $("#resTitle").on("click",function(){
            $("#extraPadding").toggle(500);
        });
    });
</script>
</html>